<script setup lang="ts">
import { ROUTES_LINKS } from '@/config'

const toggleSideNav = inject<() => boolean>('toggleSideNav')
</script>

<template>
  <aside class="app-sidenav-item">
    <div class="sidenav-title">
      <h1>最新文章</h1>
    </div>
    <div class="sidenav-item-body p-7">
      <ol class="app-sidenav-article list-decimal" />
    </div>
    <ul class="container justify-start flex-1 py-4 space-y-8" hidden>
      <li v-for="{ title, path } in ROUTES_LINKS" :key="title" class="text-xl font-semibold text-black-coffee">
        <NuxtLink :to="path" @click="toggleSideNav">
          {{ title }}
        </NuxtLink>
      </li>
    </ul>
  </aside>
</template>
